<h2> Data Master</h2>
<div id=grid></div>

<script>
                $(document).ready(function() {


                    dataSource = new kendo.data.DataSource({
                        transport: {
                            read:  {
                                url: "<?=base_url();?>/index.php/user/getAllUser",
                                dataType: "json"
                            },
                            destroy: {
                            	url: "<?=base_url();?>/index.php/user/deleteUser",
                            	dataType: "json",
                    			type: "POST"
                            },
                            create: {
                            	url: "<?=base_url();?>/index.php/user/addUser",
                            	 
                    			type: "POST"
                                
                            },
                            error: function (e) {
                                alert(e);
                            },
                            success: function (e) {
                                alert(e);
                            },
                            
                            parameterMap: function(options, operation) {
                                if (operation !== "read" && options.models) {
                                    return {model3:  options.models };
                                }
                            }
                            
                        },
                    refresh: true,
                    batch: true,
                    pageSize: 30,
                    schema: {
                        model: {
                            id: "user_id",
                            fields: {
                                user_id: {editable: false, nullable: true} ,
                            	user_username: { type: "string" },
                                user_fname: { type: "string" },
                                user_lname: { type: "string" },
                                user_email:{ type: "string" },
                                user_mobile:{ type: "string" }
                            }
                        }
                    }
                });
                
                    $("#grid").kendoGrid({
                    	dataSource: dataSource,
                    	error: function(e) {
							alert(e.responseText);
						},
                    	sortable: {
                            mode: "single",
                           
                            allowUnsort: false
                        },
                   		filterable: true,
                        pageable: true, 
                        scrollable: false,
                        toolbar: [{ name: "create", text: "เพิ่มรายชื่อ" }],
                        
                        columns: [ {
                                     field: "user_id",
                                     title: "User ID",
                                     width: "10px"
                                  } ,
                                  {
  		                            field: "user_username",
  		                            title: "Username",
  		                            width: "30px"
  		                         } ,
		                         {
		                             field: "user_fname",
		                             title: "First Name",
		                             width: "50px"
		                          } ,
                                 
                                  {
                                      field: "user_lname",
                                      title: "Last Name",
                                      width: "50px"
                                   } ,
 
                                    {
                                        field: "user_email",
                                        title: "Email",
                                        width: "100px"
                                     } ,
                                     {
                                         field: "user_mobile",
                                         title: "Mobile ",
                                         width: "50px"
                                      } ,
                                      
                                       { command: ["edit", "destroy"], title: "destroy", width: "100px" }], 
                                  editable: "popup"
               
 
        });
    });                
            </script>
